<template>
  <div class="home">
    <div class="home-top">
      <home-category></home-category>
      <home-banner></home-banner>
    </div>
    <!-- 新鲜好物 -->
    <home-new></home-new>
    <!-- 人气推荐 -->
    <home-hot></home-hot>
    <!-- 品牌推荐 -->
    <home-brand></home-brand>
    <!-- 分类 -->
    <home-product></home-product>
    <!-- 专题 -->
    <home-special></home-special>
  </div>
</template>

<script>
  import HomeBanner from "./components/HomeBanner.vue";
  import HomeBrand from "./components/HomeBrand.vue";
  import HomeCategory from "./components/HomeCategory.vue";
  import HomeHot from "./components/HomeHot.vue";
  import HomeNew from "./components/HomeNew.vue";
  import HomeProduct from './components/HomeProduct.vue';
  import HomeSpecial from './components/HomeSpecial.vue';

  export default {
    name: "Index",
    components: {
      HomeCategory,
      HomeBanner,
      HomeNew,
      HomeHot,
      HomeBrand,
      HomeProduct,
      HomeSpecial,
    },
  };

</script>

<style lang="less" scoped>
  .home-top {
    width: 1240px;
    position: relative;
    margin: 0 auto;
  }

</style>
